﻿@page
@using Volo.Abp.AspNetCore.Mvc.UI.Theming;
@using YaAppoint.Web.Pages.Account
@model MyLoginModel
@inject IThemeManager ThemeManager
@inject Volo.Abp.Settings.ISettingProvider SettingProvider
@{
    Layout = ThemeManager.CurrentTheme.GetEmptyLayout();
}

@section styles
{
    <style>
        body::before {
            content: "";
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-image: url(/images/login-background.jpg);
            background-size: cover;
            background-repeat: no-repeat;
            opacity: 0.1;
        }

        .container {
            display: flex;
            align-items: center;
            justify-content: center;
            height: 100vh;
            min-width: 100%;
        }

            .container > .login-container {
                width: 100%;
            }

                .container > .login-container.cert-login .login-form-title,
                .container > .login-container.cert-login .password-container,
                .container > .login-container.cert-login .remember-me-container,
                .container > .login-container .cart-id-container {
                    display: none !important;
                }

                .container > .login-container.cert-login .cert-login-form-title,
                .container > .login-container.cert-login .switch-normal-login {
                    display: block !important;
                }

        .foot {
            margin-top: 25px;
            font-size: 19px;
            color: #ddd;
            text-align: center;
        }
    </style>
}

@section scripts
{
    <abp-script src="/Pages/Account/Login.cshtml.js" />
}

<abp-row class="login-container">
    <abp-column class="col mx-auto" style="max-width: 550px">
       
        <div class="card mt-10 shadow-sm rounded">
            <div class="card-body p-5">
                <h4 class="login-form-title">登录</h4>
                @Html.ValidationSummary(true, "", new { @class = "text-danger" })
                <form id="login-form" method="post" class="mt-4">
                    <div class="mb-3">
                        <label asp-for="UserName" class="form-label">用户名</label>
                        <input asp-for="UserName" class="form-control" autocomplete="off" placeholder="请输入用户名" />
                        <span asp-validation-for="UserName" class="text-danger"></span>
                    </div>

                    <div class="mb-3 password-container">
                        <label asp-for="Password" class="form-label"></label>
                        <div class="input-group">
                            <input type="password" class="form-control" autocomplete="new-password" placeholder="请输入密码" asp-for="Password" />
                            <button class="btn btn-secondary" type="button" id="PasswordVisibilityButton"><i class="fa fa-eye-slash" aria-hidden="true"></i></button>
                        </div>
                        <span asp-validation-for="Password"></span>
                    </div>

                    <div class="mb-3">
                        <abp-select asp-for="Department" asp-items="Array.Empty<SelectListItem>()" class="form-control" >
                        </abp-select>
                    </div>

                    <div class="mb-3 remember-me-container">
                        <abp-input asp-for="RememberMe" />
                    </div>

                    <div class="d-grid gap-2">
                        <abp-button type="submit" button-type="Primary" name="Action" value="Login" class="btn-lg mt-3">登录</abp-button>
                    </div>
                </form>
            </div>
        </div>
        <div class="foot">
            <div>永安医技预约平台</div>
        </div>
    </abp-column>
</abp-row>